<template>
  <div class="address-edit">
    <nav-bar title="收货地址"></nav-bar>
    <van-address-edit :area-list="areaList"
                      :address-info="AddressInfo"
                      show-set-default
                      detail-rows="2"
                      :is-saving="saveLoading"
                      :area-columns-placeholder="['请选择', '请选择', '请选择']"
                      @save="onSave"
                      @delete="onDelete"
                      @change-detail="onChangeDetail" />
  </div>
</template>

<script>
import NavBar from '@/components/NavBar'
import { areaList } from '@/utils/area.js'
export default {
  data () {
    return {
      areaList,
      saveLoading: false,
      AddressInfo: {

      }
    };
  },
  components: {
    NavBar
  },
  created () {
    this.addressId = this.$route.query.id
    if (this.addressId) this.AddressInfo = {
      addressDetail: "123131",
      areaCode: "150304",
      city: "乌海市",
      county: "乌达区",
      isDefault: true,
      name: "1",
      province: "内蒙古自治区",
      tel: "13869393999",
    }
  },
  methods: {
    onSave (...args) {
      console.log(args);
    },
    onDelete () {
      Toast('delete');
    },
    onChangeDetail (val) {
    },
  }
}

</script>

<style lang='scss' scoped>
.address-edit {
  @include top-page;
  background-color: #eeeeee;
  ::v-deep .van-address-edit {
    .van-switch--on {
      background-color: #e85014;
    }
    .van-button {
      margin-top: 25%;
      background-color: #e85014;
      border: 1px solid #e85014;
      font-size: 0.3rem;
    }
  }
}
</style>